<?php if (!defined('THINK_PATH')) exit();?><!-- script start -->
<script type="text/javascript">
    BUI.use(['bui/layout','bui/tab','bui/data','bui/tree'],function (Layout,Tab,Data,Tree) {

        var
                nodes = [
                    {text : '1',id : '1',children: [{text : '11',id : '11',href:'11.html'}]},
                    {text : '2',id : '2',expanded : true,children : [
                        {text : '21',id : '21',children : [{text : '211',id : '211',href:'211.html'},{text : '212',id : '212',href:'212.html'}]},
                        {text : '22',id : '22',href:'22.html'}
                    ]},
                    {text : '3',id : '3',href:'3.html'},
                    {text : '4',id : '4',href:'4.html'}
                ];
        var control = new Layout.Viewport({
            width:600,
            height:500,
            elCls : 'ext-border-layout',
            children : [{
                xclass : 'controller',
                layout : {
                    region : 'south',
                    title : 'south',
                    fit : 'height',
                    height : 50
                },
                width : 250,
                content : '底部信息'
            },{
                xclass : 'controller',
                layout : {
                    region : 'east',
                    fit : 'both',
                    collapsable : true,
                    collapsed : true,
                    title : '默认收缩',
                    width : 150
                },
                elCls : 'red',
                content : "三 自适应宽高"
            },{
                layout : {
                    region : 'west',
                    fit : 'both', //height,width,both,none
                    title : '目录',
                    collapsable : true,
                    width : 250
                },
                xclass : 'tree-list',//生成tree
                id : 'mytree',
                nodes : nodes

            },{
                xclass : 'nav-tab', //Grid
                layout : {
                    region : 'center',
                    title : '内容',
                    fit : 'both'
                },
                id : 'tab'
            }],
            plugins : [Layout.Border]
        });

        control.render();
        var tab = control.getChild('tab'),//通过id获取
                tree = control.getChild('mytree',true);  //级联查找树节点

        tree.on('itemclick',function (ev) {
            var node = ev.item,
                    id = node.id,
                    text = node.text,
                    href = node.href;
            tab.addTab({
                title : text,
                href : href,
                id : id
            });
        });
    });
</script>
<!-- script end -->